<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<head>
<style>
img{
    float: right;
    border: 1px dotted black;
    margin: 0px 0px 15px 20px ;
}
</style>
</head>
<body>
<p>
    在下面的段落中，图像将向右浮动。黑色的虚线边框被添加到图像。
    我们还为图像添加了外边距以将文本推离图像：
    图像的上、右外边距为 0px，下外边距为 15px，左外边距为 20px。
</p>
        
<p><img src="../w3logo-1.png" width="188" height="267">
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
    段落段落段落段落段落段落段落
</p>
</body>
</html>